body {
    font-family: Arial, sans-serif;
    margin: 20px;
    background-image: url("../images/bg.jpg"); /* 修改路径 */
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
}


.container { 
    max-width: 600px; 
    margin: 0 auto; 
    padding: 20px; 
    background: rgba(255, 255, 255, 0.2); /* 半透明背景 */
    border-radius: 8px; 
    box-shadow: 0 2px 8px rgba(0,0,0,0.1); 
    backdrop-filter: blur(10px); /* 毛玻璃效果 */
    border: 1px solid rgba(255, 255, 255, 0.3); /* 半透明边框 */
}

label { 
    display: block; 
    margin: 10px 0 5px; 
    font-weight: 500; 
    color: #333; 
}
select {
    width: 100%;
    padding: 12px;
    background: rgba(255, 255, 255, 0.2); /* 半透明背景 */
    border: 2px solid rgba(255, 255, 255, 0.5); /* 加粗半透明边框 */
    border-radius: 4px;
    color: #333; /* 改为深色文字 */
    cursor: pointer;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px); /* 毛玻璃效果 */
    box-shadow: 0 2px 8px rgba(0,0,0,0.1),
                inset 0 0 0 1px rgba(255, 255, 255, 0.3); /* 添加内阴影 */
    appearance: none; /* 移除默认样式 */
    -webkit-appearance: none;
    -moz-appearance: none;
}

select:hover {
    background: rgba(255, 255, 255, 0.3); /* 鼠标悬停时增加透明度 */
    border-color: rgba(255, 255, 255, 0.8); /* 加深边框颜色 */
    box-shadow: 0 4px 12px rgba(0,0,0,0.2),
                inset 0 0 0 1px rgba(255, 255, 255, 0.5); /* 加深内阴影 */
}

select:focus {
    outline: none;
    border-color: rgba(255, 255, 255, 0.8); /* 聚焦时加深边框颜色 */
}
input { 
    width: 100%; 
    padding: 12px; 
    box-sizing: border-box; 
    border: 1px solid #ddd; 
    border-radius: 4px; 
    transition: border-color 0.3s ease; 
}

input:focus { 
    border-color: #007bff; 
    outline: none; 
}

button { 
    margin: 10px 0; 
    padding: 12px 24px; 
    background: rgba(255, 255, 255, 0.2); /* 半透明背景 */
    color: white; 
    border: 2px solid rgba(255, 255, 255, 0.5); /* 加粗半透明边框 */
    border-radius: 4px; 
    cursor: pointer; 
    transition: all 0.3s ease; 
    backdrop-filter: blur(10px); /* 毛玻璃效果 */
    box-shadow: 0 2px 8px rgba(0,0,0,0.1), 
                inset 0 0 0 1px rgba(255, 255, 255, 0.3); /* 添加内阴影 */
}

button:hover { 
    background: rgba(255, 255, 255, 0.3); /* 鼠标悬停时增加透明度 */
    border-color: rgba(255, 255, 255, 0.8); /* 加深边框颜色 */
    box-shadow: 0 4px 12px rgba(0,0,0,0.2), 
                inset 0 0 0 1px rgba(255, 255, 255, 0.5); /* 加深内阴影 */
}
.result {
    margin-top: 20px;
    white-space: pre-wrap;
    background: #f5f5f5;
    padding: 15px;
    border-radius: 4px;
    font-family: monospace;
    max-height: 400px; /* 设置最大高度 */
    overflow-y: auto; /* 添加垂直滚动条 */
    line-height: 1.5; /* 增加行高，提高可读性 */
}